<template>
  <!-- #region template -->
  <div>
    <BCardGroup deck>
      <BCard
        bg-variant="primary"
        text-variant="white"
        header="Primary"
        class="text-center"
      >
        <BCardText>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</BCardText>
      </BCard>
      <BCard
        bg-variant="secondary"
        text-variant="white"
        header="Secondary"
        class="text-center"
      >
        <BCardText>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</BCardText>
      </BCard>
      <BCard
        bg-variant="success"
        text-variant="white"
        header="Success"
        class="text-center"
      >
        <BCardText>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</BCardText>
      </BCard>
    </BCardGroup>
  </div>
  <div class="mt-3">
    <BCardGroup deck>
      <BCard
        bg-variant="info"
        text-variant="white"
        header="Info"
        class="text-center"
      >
        <BCardText>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</BCardText>
      </BCard>
      <BCard
        bg-variant="warning"
        text-variant="white"
        header="Warning"
        class="text-center"
      >
        <BCardText>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</BCardText>
      </BCard>
      <BCard
        bg-variant="danger"
        text-variant="white"
        header="Danger"
        class="text-center"
      >
        <BCardText>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</BCardText>
      </BCard>
    </BCardGroup>
  </div>
  <div class="mt-3">
    <BCardGroup deck>
      <BCard
        bg-variant="light"
        header="Light"
        class="text-center"
      >
        <BCardText>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</BCardText>
      </BCard>
      <BCard
        bg-variant="dark"
        header="Dark"
        text-variant="white"
        class="text-center"
      >
        <BCardText>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</BCardText>
      </BCard>
      <BCard
        header="Default"
        class="text-center"
      >
        <BCardText>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</BCardText>
      </BCard>
    </BCardGroup>
  </div>
  <!-- #endregion template -->
</template>
